<template>
	<view>
		<sclIntroPageTypeLoveMbti v-if="detail && introType=='love-mbti'" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<sclIntroPageTypeJobMbti v-else-if="detail && introType=='job-mbti'" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!-- this.paramObj.from && this.introType=='32-multi-mbti' -->
		<sclIntroPageType32MultiMbti v-else-if="detail && (introType=='32-multi-mbti')" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:from="fromPage" :scrollTopNum="scrollTopNum" @startScl="startMultiScl" @backHandle="backHandle" />
		<sclIntroPageType32Mbti v-else-if="detail && (introType=='32-mbti' || introType=='xg-mbti')" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />

		<sclIntroPageTypeQX v-else-if="detail && (introType=='qx')" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!-- <sclIntroPageTypeDongWuLianAi
	  v-else-if="detail && (introType=='dongwulianai')"
	  :sclInfo="detail"
	  :isShowPriceWrapper="isShowPriceWrapper"
	  :isFromEshopLink="isFromEshopLink"
	  :extraInfo="extraInfo"
	  :scrollTopNum="scrollTopNum"
	  @startScl="startScl"
	  @backHandle="backHandle"
	/> -->
		<!--    <sclIntroPageTypeXgMbti
          v-else-if="detail && introType=='xg-mbti'"
          :sclInfo="detail"
          :isShowPriceWrapper="isShowPriceWrapper"
          :isFromEshopLink="isFromEshopLink"
          :extraInfo="extraInfo"
          :scrollTopNum="scrollTopNum"
          @startScl="startScl"
          @backHandle="backHandle"
        />
        -->


		<!-- v-else-if="detail && introType=='tmms'" -->
		<sclIntroPageTypeTMMS v-else-if="detail && introType=='tmms'" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!-- v-else-if="detail && introType=='sbis'"-->
		<sclIntroPageTypeSBIS v-else-if="detail && introType=='sbis' " :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!-- v-else-if="detail && introType=='spm'" -->
		<sclIntroPageTypeSPM v-else-if="detail && introType=='spm'" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!-- v-else-if="detail && introType=='love-cryl'" -->
		<sclIntroPageTypeCRYL v-else-if="detail && introType=='love-cryl'" :sclInfo="detail"
			:isShowPriceWrapper="isShowPriceWrapper" :isFromEshopLink="isFromEshopLink" :extraInfo="extraInfo"
			:scrollTopNum="scrollTopNum" @startScl="startScl" @backHandle="backHandle" />
		<!--颜色性格-->
		<sclIntroPageTypeFpacpt v-else-if="detail && introType=='fpacpt'" :sclInfo="detail" @startScl="startScl"
			@backHandle="backHandle" />

		<!--动物森林-->
		<sclIntroPageTypeAnimalForest v-else-if="detail && introType=='animalforest'" :sclInfo="detail"
			@startScl="startScl" @backHandle="backHandle" />
		<!--BEST性格-->
		<sclIntroPageTypeBestxg v-else-if="detail && introType=='bestxg'" :sclInfo="detail" @startScl="startScl"
			@backHandle="backHandle" />
		<!--女神节-遇见你更美好-->
		<sclIntroPageTypeGoddess v-else-if="detail && introType=='goddess'" :sclInfo="detail" @startScl="startScl"
			@backHandle="backHandle" />
		<!--女王驾到-->
		<sclIntroPageTypeQueen v-else-if="detail && introType=='queen'" :sclInfo="detail" @startScl="startScl"
			@backHandle="backHandle" />
		<view v-else-if="detail && pageType != 'full'" class="container scl-introduce-page" :style="[
        {backgroundColor:'#F9F9F9'},
      ]">
			<navigationBar :emitBackEvent="true" @backEvent="backHandle" :my-property="navigationBarDataInfo" />

			<template>
				<image v-if="detail.detailImg" :src="detail.detailImg" mode="widthFix" class="scl-img"></image>
				<image v-else :src="detail.coverImg" mode="widthFix" class="scl-img"></image>
			</template>

			<view class="scl-info">
				<view class="si-title">
					{{detail.sclName}}
				</view>
				<view class="si-tips">{{detail.summary}}</view>
				<view class="sib-price">
					<view class="si-price" v-if="isShowPriceWrapper">
						<template v-if="currentPrice == 0">
							<view style="height: 50rpx;line-height: 50rpx;">限时免费</view>
						</template>
						<template v-else-if="detail.discountType === 4">
							<view class="yiyuan-discount">1元测</view>
						</template>
						<template v-else-if="isFromEshopLink">
							<!-- 从测评链接进入的只显示现价 -->
							<view class="original-price-text">¥{{currentPrice}}</view>
						</template>
						<template v-else-if="detail.discountType">
							<view class="price-block-wrapper">
								<view class="row-1">
									<view class="now-price-box">
										<text class="unit">¥</text>
										<text class="price">{{discountedPrice}}</text>
									</view>
									<view class="price-wrapper">
										<view class="price-text">原价</view>
										<view class="price-box">
											<text class="unit">¥</text>
											<text class="price">{{currentPrice}}</text>
										</view>
									</view>
								</view>
								<view class="row-2">
									<view class="info-box"
										:style="{'background-image':`url(${staticImgs.shapeIconBg})`}">
										{{discountNumText}}优惠
									</view>
								</view>
							</view>

						</template>
						<template v-else>
							<!-- 默认显示 -->
							<view class="price-block-wrapper">
								<view class="row-1">
									<view class="now-price-box">
										<text class="unit">¥</text>
										<text class="price">{{currentPrice}}</text>
									</view>
								</view>
							</view>
						</template>
					</view>


					<view class="view-num">
						<image :src="test_num" class="test-num" mode=""></image>
						{{detail.collectNums || 0}}次
					</view>
				</view>

				<view class="scl-checkup-group-entrance"
					v-if="detail.isSclExaminationExist == 'Y' && detail.isSclExaminationDepressionExist != 'Y'">

					<view class="scl-checkup-group-entrance-box" @click="toSclCheckUp">
						<view class="left-box">
							<view class="price-box">
								<text class="unit-icon">¥</text>
								<text class="num">{{checkupPrice}}</text>
							</view>
							<text class="text">心理健康体检（包含6个测评）</text>
						</view>
						<view class="right-box">
							去测试
							<image class="img" :src="staticImgs.rightIcon" mode=""></image>
						</view>
					</view>

				</view>

			</view>

			<view @click="toSclCheckUp" class="scl-depression-checkup-group-entrance"
				v-if="detail.isSclExaminationDepressionExist == 'Y'">
				<view class="price">¥{{price}}</view>
				<view class="txt">青少年抑郁双相诊断（包含5个测评）</view>
				<view class="img-abs">
					<image class="img" :src="staticImgs.depressionCheckupEntrance" mode="widthFix"></image>
				</view>
			</view>

			<view class="scl-content-box summary-info-wrapper style-a-page">
				<template v-if="sclType===1">
					<view class="nums-info-wrapper">
						<view class="num-box" v-if="extraInfo.qstnCount">
							<view class="row-1">精选问题</view>
							<view class="row-2">
								<text class="num">{{extraInfo.qstnCount}}</text>
								<text class="text">题</text>
							</view>
						</view>

						<view class="num-box" v-if="extraInfo.testTimesNum.num">
							<view class="row-1">测试约需</view>
							<view class="row-2">
								<text class="num">{{extraInfo.testTimesNum.num}}</text>
								<text class="text">{{extraInfo.testTimesNum.unit}}</text>
							</view>
						</view>

						<view class="num-box" v-if="extraInfo.sclPageSize">
							<view class="row-1">专业报告</view>
							<view class="row-2">
								<text class="num">{{extraInfo.sclPageSize}}</text>
								<text class="text">页</text>
							</view>
						</view>
					</view>
				</template>
				<image :src="introTitImg" mode="" class="scb-title-bg"></image>
				<view class="sc-content" v-html="detail.details"></view>
				<template v-if="sclType===1">
					<view class="test-benefits-block">
						<view class="tit">测试能获得什么</view>
						<view class="content-box">
							<view class="sub-tit">此测评中你能获得：</view>
							<view class="ul-box">
								<view class="li" v-for="(item,index) in summaryInfo.testBenefits">
									(<text class="index-text">{{index+1}}</text>) {{item}}
								</view>
							</view>
						</view>
					</view>
					<view class="target-audience-block">
						<view class="tit">适合谁测</view>
						<view class="content-box" :style="{backgroundImage:'url('+staticImgs.boxBg+')'}">
							<view class="ul-box">
								<view class="li" v-for="(item,index) in summaryInfo.targetAudience">
									<text class="index-text">{{index+1}}</text>
									<text class="con-text">{{item}}</text>
								</view>
							</view>
						</view>
					</view>

					<view class="instructions-block">
						<view class="tit">测评需知</view>
						<view class="content-box-wrapper">
							<view class="content-box">
								<image class="img" :src="staticImgs.introTitBoxImg" mode=""></image>
								<view class="text" style="margin-bottom: 12rpx;">
									{{summaryInfo.evaluationInstructionsTip}}
								</view>
								<view class="text text-indent"
									v-for="(item,index) in summaryInfo.evaluationInstructions">
									{{item}}
								</view>
							</view>
						</view>
					</view>

					<view class="tips-block">
						<view class="tit">测评说明</view>

						<view class="ul-box">
							<view class="li" v-for="(item,index) in summaryInfo.tips">
								<text class="index-text">{{index+1}}、</text>
								<text class="con-text">{{item}}</text>
							</view>
						</view>
					</view>

					<view class="references-box" v-if="referenceList && referenceList.length">
						<view class="tit">参考文献</view>
						<view class="text-list">
							<view class="text" v-for="(text,index) in referenceList" :key="index">
								[{{index+1}}]{{text}}
							</view>
						</view>
					</view>

				</template>
			</view>
			<!-- 开始测评按钮 -->
			<view class="scl-start-btn-wrapper-pos">
				<view class="scl-start-btn-wrapper">
					<image :src="startBtnImg" mode="" class="scl-start" @click="startScl()"></image>
					<image v-if="showYiyuanFloatTip" class="yiyuan-intro-tip down-and-up" :src="staticImgs.yiyuanTip">
					</image>
				</view>
			</view>
		</view>

		<template v-else-if="detail && pageType == 'full'">
			<sclIntroPageType06 v-if="fullType == 'x06'" :sclInfo="detail" :showPrivacyTip="showPrivacyTip"
				:isShowPriceWrapper="isShowPriceWrapper" @startScl="startScl" @backHandle="backHandle" />

			<view v-else class="container scl-introduce-full-img-page" :style="[
          {'background-image':(`url(${fullPageImg})`)}
        ]">
				<template>
					<view v-if="backBtn.img" class="back-img-wrapper" @click.stop="backHandle"
						:style="{bottom:backBtn.wrapperBottom}">
						<view :style="{
                width:backBtn.style.width,
                height: backBtn.style.height
              }">
							<image style="width: 100%;height: 100%;" :src="backBtn.img"></image>
						</view>
					</view>
					<view v-else class="back-wrapper" @click.stop="backHandle">
						<image class="img" :src="staticImgs.backIcon" mode=""></image>
						<text class="text">返回</text>
					</view>
				</template>

				<template>
					<template v-if="fullPageIntroBtn.img">

						<view class="full-page-intro-btn-wrapper" :style="{bottom:fullPageIntroBtn.wrapperBottom}">
							<view v-if="moreType == 'qingyunian' || moreType == 'qingyunian-zrb'"
								class="black-animation">
								<text class="b"></text>
							</view>
							<view class="full-page-intro-btn-inner">
								<view @click="startScl()" :style="{
                    width:fullPageIntroBtn.style.width,
                    height: fullPageIntroBtn.style.height
                  }">
									<image style="width: 100%;height: 100%;" :src="fullPageIntroBtn.img"></image>
								</view>

								<image class="hand-img loop-pointer" :src="staticImgs.handPointer" mode=""></image>
							</view>
						</view>
					</template>
					<view v-else class="btn-wrapper"
						:style="{'bottom':styleBottomObj.btnWrapper,width:styleBottomObj.btnW,height:styleBottomObj.btnH}"
						@click="startScl()">
						<view class="btn-inner-wrapper">
							<image v-if="staticImgs.introBtnImg" class="main-img" :src="staticImgs.introBtnImg" mode="">
							</image>
							<image class="img loop-pointer" :src="staticImgs.handPointer" mode=""></image>
						</view>

						<view class="intro-text">{{fullSclIntro}}</view>
					</view>
				</template>

				<view v-if="showPrivacyTip" class="privacy-tip-text">
					为向您提供服务，请您如实、准确填写以上信息提交即表示您同意上海开怀大笑健康管理咨询有限公司收集前述信息、为您提供服务。仅供娱乐，内部使用。
				</view>

			</view>
		</template>

		<!-- 弹窗 -->
		<template>
			<YiyuanIntroModal :visible="yiyuanIntroModalVisible" />
			<YiyuanLbModal @rightClick="lbRightClickHandle" @leftClick="startScl('skipYiyuanLbModal')"
				:visible="yiyuanLbModalVisible" />
			<NewDiscountModal btnType="1" tipTxt="仅当前测评可用" @close="closeCouponModalHandle"
				:visible="claimCouponModalVisible" :discountNum="10" />
		</template>
		<!-- 弹窗 -->
	</view>
</template>

<script>
	import {
		get_scl_info,
		orderPay,
		updateSclBuyNum,
		checkUserIsPayScl,
		isEshopScl
	} from '@/common/api/scl_api.js'
	import {
		getDisCountZeroScl,
		updateUserInfo,
		getIsNextCouponIsYiyuan
	} from '@/common/api/user_api.js'
	import {
		checkTargetTaskStatus
	} from '@/common/api/task'

	import {
		removeEmptyProperty,
		splitString,
		calculateDiscountedPrice
	} from '@/common/utils/util.js'
	import {
		mapState,
		mapGetters
	} from 'vuex'
	import navigationBar from "@/components/navigationBar/navigationBar.vue";

	import {
		debounce
	} from 'lodash'
	import YiyuanIntroModal from '@/subcontractorC/components/YiyuanIntroModal.vue'
	import YiyuanLbModal from '@/subcontractorC/components/YiyuanLbModal.vue'
	import sclIntroPageType06 from './scl-intro-page-type-06.vue'
	import sclIntroPageTypeJobMbti from './scl-intro-page-type-job-mbti.vue'
	import sclIntroPageTypeSPM from './scl-intro-page-type-spm.vue'
	import sclIntroPageTypeCRYL from './scl-intro-page-type-cryl.vue'
	import sclIntroPageTypeSBIS from './scl-intro-page-type-sbis.vue'
	import sclIntroPageTypeTMMS from './scl-intro-page-type-tmms.vue'
	import sclIntroPageTypeLoveMbti from './scl-intro-page-type-love-mbti.vue'
	import sclIntroPageTypeXgMbti from './scl-intro-page-type-xg-mbti.vue'
	import sclIntroPageType32Mbti from './scl-intro-page-type-32-mbti.vue'
	import sclIntroPageType32MultiMbti from './scl-intro-page-type-32-multi-mbti.vue'
	import sclIntroPageTypeQX from './scl-intro-page-type-qx.vue'
	import NewDiscountModal from '@/subcontractorC/components/NewDiscountModal.vue'
	// import sclIntroPageTypeDongWuLianAi from './scl-intro-page-type-dongwulianai.vue'
	import sclIntroPageTypeFpacpt from './scl-intro-page-type-fpacpt.vue'
	import sclIntroPageTypeAnimalForest from './scl-intro-page-type-animal-forest.vue'
	import sclIntroPageTypeBestxg from './scl-intro-page-type-bestxg.vue'
	import sclIntroPageTypeGoddess from './scl-intro-page-type-goddess.vue'
	import sclIntroPageTypeQueen from './scl-intro-page-type-queen.vue'


	export default {
		components: {
			navigationBar,
			YiyuanIntroModal,
			YiyuanLbModal,
			sclIntroPageType06,
			sclIntroPageTypeJobMbti,
			sclIntroPageTypeSPM,
			sclIntroPageTypeCRYL,
			sclIntroPageTypeLoveMbti,
			sclIntroPageTypeSBIS,
			sclIntroPageTypeTMMS,
			sclIntroPageTypeXgMbti,
			sclIntroPageType32Mbti,
			sclIntroPageType32MultiMbti,
			sclIntroPageTypeQX,
			// sclIntroPageTypeDongWuLianAi,
			sclIntroPageTypeFpacpt,
			sclIntroPageTypeAnimalForest,
			NewDiscountModal,
			sclIntroPageTypeBestxg,
			sclIntroPageTypeGoddess,
			sclIntroPageTypeQueen
		},
		data() {
			return {
				oldPrice: 0,
				navigationBarDataInfo: {
					"bg_color": "#fff",
					"color": "#333",
					"flag": 1,
					"name": "测评介绍",
					"hasEntity": true,
				},
				showPrivacyTip: false,
				scl_introduce_title: this.imgBaseURL + '/scl/scl_introduce_title.png',
				scl_start: this.imgBaseURL + '/scl/scl_start.png', //开始测评按钮
				detail: '',
				pageLoading: false,
				paramObj: null, //测评对象 userType    sclId
				test_num: this.imgBaseURL + '/sclResult/test_num.png',
				staticImgs: {
					btnImg: this.imgBaseURL + '/scl/scl_start_btn_B.png',
					introTitImg: this.imgBaseURL + '/scl/scl_intro_tit_B.png',
					bg: this.imgBaseURL + '/scl/scl_intro_bg.png',
					boxBg: this.imgBaseURL + '/scl/scl_intro_bg_2.png',
					introTitBoxImg: this.imgBaseURL + '/scl/scl_intro_tit_img.png',
					backIcon: this.imgBaseURL + '/daily/daily-page-back.png',
					handPointer: this.imgBaseURL + '/scl/result/fanhuaMBTI/hand-pointer.png',
					introBtnImg: '',
					yiyuanTip: this.imgBaseURL + '/scl/yiyuan-modal/yiyuan-intro-tip.png',
					shapeIconBg: this.imgBaseURL + '/scl/shape-icon-bg-v2.png',
					rightIcon: this.imgBaseURL + '/scl/checkup-mental/right-icon.png',

					depressionCheckupEntrance: this.imgBaseURL + '/scl/checkup-depressed/depression-checkup-entrance.png',
				},
				shareData: {
					title: '万心测心理为您的心理健康保驾护航',
					path: '/pages/index/index',
					imageUrl: this.imgBaseURL + '/img_index_share_yu_yue.jpg?' + Math.random(),
					desc: '',
					content: ''
				},
				fromPage: '',
				intervalReached: false,
				isShowCouponActivityEntry: true,
				isInterceptSwitch: false,
				discountPrice: 0,
				isSclNotFreeAndNotOwned: true, //当前测评不是免费的且不未购买过
				isNotNewCoupon: true,
				freeUse: false,
				currentPrice: 0, // 现价
				discountedPrice: 0, // 优惠后的最终价格 - 支付时的价格
				sclId: '',
				isFromEquityPage: false, //是否是从权益列表页进入的
				isFromEshopLink: false, //是否是从电商测评链接进入的
				sclType: 0, // 0 普通，1 定制
				extraInfo: {
					testTimesNum: {
						num: '',
						unit: ''
					},
					sclPageSize: '',
					qstnCount: '',
				},
				referenceList: [],
				summaryInfo: {
					contentOverview: '',
					testBenefits: [],
					targetAudience: [],
					evaluationInstructionsTip: "在正式开始本次测评之前，请您在一个安静放松的地方，让自己保持心境平和，仔细阅读下列文字：",
					evaluationInstructions: ``,
					tips: [
						'本测试每次下单仅能测试一次，若需要多次测试，可以重复下单。',
						'如在测试过程中遇到问题，可在【我的-联系我们】进行处理。',
						'测试完成后可在【订单-我的测评】中随时查看报告。',
						'本测试为虚拟服务内容，购买成功后不退不换。'
					],
				},
				closeAdditional: false,
				pageType: 'normal', //normal , full
				fullPageImg: '',
				fullType: '', //'fanhua' , 'x02'
				fullSclIntro: '',
				styleBottomObj: {
					priceWrapper: 0,
					btnWrapper: 0
				},
				yiyuanIntroModalVisible: false,
				yiyuanLbModalVisible: false,
				// discountType:0,
				showYiyuanFloatTip: false,
				claimCouponModalVisible: false,
				isAfterPay: false,
				hasShowYiyuanLbModal: true, //默认
				moreType: '',
				endPageType: '',
				homeModalType: '',
				introType: '',
				scrollTopNum: 0,
				fullPageIntroBtn: {
					img: '',
					wrapperBottom: '0',
					style: {

					}
				},
				backBtn: {
					img: '',
					wrapperBottom: '0',
					style: {

					}
				},
				price: '',
				checkupPrice: ''
			}
		},
		computed: {
			...mapGetters('user', [
				'isLogin',
				'discountA',
				'discountB', 'discountC', 'discountD', 'discountE', 'usedOk', 'clientUserUid', 'hasShowYiyuanModal',
				'isEshopUser', 'discountYiYuan'
			]),
			...mapState({
				notUseLbYiyuan: state => state.user.notUseLbYiyuan,
				discountId: state => state.user.discountId,
				discountType: state => state.user.discountType,
				userJson: state => state.user.userJson,
			}),
			isUseYiyuanAndNotLb() {
				return this.discountType === 4 && this.notUseLbYiyuan && this.detail && this.detail.discountType === 4
			},
			viewPrice() {
				return this.detail?.discountType ? this.discountedPrice : this.currentPrice
			},
			discountNumText() {
				return this.detail?.discount == 10 ? '0元' : `${this.detail?.discount}折`
			},
			introTitImg() {
				return this.scl_introduce_title
			},
			startBtnImg() {
				return this.scl_start
			},
			isFullPageScl() {
				return this.pageType == 'full' && this.fullType != 'x04'
			},
			isShowPriceWrapper() {
				return !this.isFromEquityPage && !this.isAfterPay
			}
		},
		onPageScroll(e) {
			this.scrollTopNum = e.scrollTop
		},
		async onLoad(options) {
			this.$u.api.getSclListByGroup().then(res => {
				if (res.data.success) {
					this.price = res.data.data.price
				}
			})
			this.$u.api.getCheckUpList().then(res => {
				if (res.data.success) {
					this.checkupPrice = res.data.data.price
				}
			})
			try {
				this.paramObj = JSON.parse(options.paramObj)
				this.sclId = this.paramObj.sclId
				this.isFromEquityPage = !!this.paramObj.equityType
				this.fromPage = this.paramObj.from
				this.isFromEshopLink = this.paramObj.userType == 'e-commerce'
			} catch {
				this.$showToast("服务异常,请联系管理员")
			}

			if (this.paramObj.userType && this.paramObj.userType != 'e-commerce') {
				this.paramObj.userType = 'tt-public-scl';
			}

			uni.showLoading()

			if (!await this.checkSclRedirect()) return

			console.log('----showLoading---')

			try {
				await this.initPageData()
				console.log('----initPageData---')
				this.initStyle()
			} catch (e) {
				console.log('------cathc')
				//TODO handle the exception
			}

			uni.hideLoading()

			if (!this.isLogin) return


			// this.claimCouponModalVisible = true


			const {
				data: fRes
			} = await isEshopScl({
				sclId: this.sclId
			})
			if (fRes.data) return //如果是电商测评则不提示


			if (this.paramObj.code) {
				console.log('复购开关-------------------' + this.detail.repurchaseSwitch)
				if (this.detail.repurchaseSwitch !== 'on') {
					return
				}
				const {
					data: couponRes
				} = await this.$u.api.addUserDiscountCode({
					code: this.paramObj.code
				})
				console.log('couponRes：', couponRes)
				if (couponRes.data && this.detail.repurchaseSwitch === 'on') {
					// 复购开关打开才弹优惠券
					this.claimCouponModalVisible = true
				}
			}


			const {
				data: dRes2
			} = await getIsNextCouponIsYiyuan({
				sclId: this.sclId
			})

			if (dRes2.data?.discountType === 4) {
				this.showYiyuanFloatTip = true
			}

			if (this.showYiyuanFloatTip == true && !this.hasShowYiyuanModal) {
				this.yiyuanIntroModalVisible = true

				let tmpJsonStr
				try {
					tmpJsonStr = JSON.parse(this.userJson)
					tmpJsonStr = JSON.stringify({
						...tmpJsonStr,
						hasShowYiyuanModal: 'Y'
					})
				} catch (e) {
					tmpJsonStr = JSON.stringify({
						hasShowYiyuanModal: 'Y'
					})
				}

				updateUserInfo({
					userJson: tmpJsonStr
				}).then(res => {
					this.$store.commit('user/setUserJson', tmpJsonStr)
				})

			}
		},
		methods: {
			async closeCouponModalHandle() {
				await this.initPageData()
				this.claimCouponModalVisible = false
			},
			startMultiScl(code) {
				this.paramObj.qstnCode = code

				console.log(this.paramObj, '=-=========this.paramObj')
				this.startScl()
			},
			updateYiyuanLbStatus() {
				this.$store.commit('user/setNotUseLbYiyuan', false)
			},
			lbRightClickHandle() {
				this.startScl(13)
			},
			toSclCheckUp() {
				if (this.detail.isSclExaminationDepressionExist == 'Y') {
					uni.redirectTo({
						url: '/subcontractorC/pages/checkupDepressed/index?sourceType=20&sclId=' + this.sclId
					})
				} else {
					uni.redirectTo({
						url: '/subcontractorC/pages/sclCheckup/sclCheckup?sourceType=20&sclId=' + this.sclId
					})
				}

			},
			initStyle() {
				const systemInfo = uni.getSystemInfoSync();
				const safeAreaBottom = systemInfo.safeAreaInsets.bottom
				const bottom72 = this.rpxToPx(72)
				const wHeight = systemInfo.windowHeight

				console.log(wHeight, '====wHeight')
				console.log(bottom72, '=====bottom72')

				this.styleBottomObj.btnW = '100vw'
				this.styleBottomObj.btnH = '140rpx'

				if (this.fullType == 'x02' || this.fullType == 'x03') {
					if (wHeight > 767) {
						this.styleBottomObj.btnWrapper = (wHeight * 0.13) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.13) + 'px'
					} else {
						this.styleBottomObj.btnWrapper = (wHeight * 0.06) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.06) + 'px'
					}
				} else if (this.fullType == 'x04') {
					this.styleBottomObj.btnH = '460rpx'
					if (wHeight > 767) {
						this.styleBottomObj.btnWrapper = (wHeight * 0.33) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.33) + 'px'
					} else {
						this.styleBottomObj.btnWrapper = (wHeight * 0.26) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.26) + 'px'
					}
				} else {
					if (wHeight > 767) {
						this.styleBottomObj.btnWrapper = (wHeight * 0.23) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.23) + 'px'
					} else {
						this.styleBottomObj.btnWrapper = (wHeight * 0.06) + bottom72 + 'px'
						this.styleBottomObj.priceWrapper = (wHeight * 0.06) + 'px'
					}
				}
			},
			backHandle() {
				const pagesArr = getCurrentPages()

				if (this.endPageType == 'A0' || this.homeModalType == 'MBTI') {
					uni.setStorageSync('mbtiModalVisible', true)
				}
				if (this.endPageType == 'A1' || this.homeModalType == 'SPM') {
					uni.setStorageSync('iqModalVisible', true)
				}

				console.log(this.homeModalType, '========this.homeModalType')
				if (this.homeModalType == 'love-mbti') {
					uni.setStorageSync('loveMbtiModalVisible', true)
				}

				if (pagesArr.length === 1) {
					uni.reLaunch({
						url: '/pages/sclList/sclList'
					})
				} else {
					uni.navigateBack()
				}
			},
			async checkSclRedirect() {

				if (this.paramObj.code) {
					const {
						data: pRes
					} = await this.$u.api.getBySclReport({
						sclId: this.sclId
					})
					//从特殊链接进入的 携带了优惠券code，所以先判断是否跳转到结果页
					if (pRes.data) {
						const resObj = await get_scl_info(removeEmptyProperty({
							sclId: this.sclId
						}))
						if (resObj.data.data.sclName) {
							let sclName = resObj.data.data.sclName.toLowerCase();
							if (sclName.includes('knowme') || sclName.includes('know me')) {
								uni.redirectTo({
									url: '/subcontractorC/pages/sclIntroduce/knowMe/result?reportId=' + pRes
										.data +
										"&sclId=" +
										this
										.sclId
								})
							} else {
								uni.redirectTo({
									url: '/subcontractorB/pages/sclResult/sclResult?id=' + pRes.data
								})
							}
						} else {
							uni.redirectTo({
								url: '/subcontractorB/pages/sclResult/sclResult?id=' + pRes.data
							})
						}
						return false
					}
					console.log('pRes-：', pRes)
				}

				const res = await get_scl_info(removeEmptyProperty({
					sclId: this.sclId,
					code: this.$store.state.user.actCouponCode
				}))
				res.data.data = res.data.data || {}
				if (res.data.data.sclName) {
					let sclName = res.data.data.sclName.toLowerCase();
					if (sclName.includes('knowme') || sclName.includes('know me')) {
						let paramObj = {
							sclId: this.sclId,
							userId: this.getUserInfo.userId,
							userType: this.paramObj.userType
						}
						uni.redirectTo({
							url: '/subcontractorC/pages/sclIntroduce/knowMe/detail?paramObj=' + JSON.stringify(
								paramObj)
						})
						return
					}
				}

				const {
					detailInfo
				} = res.data.data || {}
				console.log(detailInfo, '---detailInfo')
				const tmpObj = JSON.parse(detailInfo) || {}
				console.log('tmpObj：', tmpObj)
				this.endPageType = tmpObj.endPageType
				this.homeModalType = tmpObj.homeModalType


				if (tmpObj.redirect) {
					if (tmpObj.redirect == 'do') {
						this.goScl()
						return false
					} else if (tmpObj.redirect == 'checkup') {
						this.toSclCheckUp()
						return false
					} else if (tmpObj.redirect == 'sexuality') {
						uni.redirectTo({
							url: '/subcontractorC/pages/sexuality-assessment/index?sclId=' + this.sclId
						})
						return false
					} else if (tmpObj.redirect == 'depression') {
						uni.redirectTo({
							url: '/subcontractorC/pages/checkupDepressed/index?sclId=' + this.sclId
						})
						return false
					}

				} else if (this.fromPage && tmpObj.introType == '32-multi-mbti') {
					this.paramObj.qstnCode = 100
					this.goScl()
					return false
				} else if (tmpObj.introType && tmpObj.introType == 'dongwulianai') {
					this.goScl()
					return false
				} else if (tmpObj.introType && tmpObj.introType == 'mailun') {
					uni.redirectTo({
						url: '/subcontractorMaiLun/pages/startMaiLun/startMaiLun?sclId=' + this.sclId
					})
					return false
				}

				this.introType = tmpObj.introType
				return true

			},
			async initPageData() {
				try {
					this.$store.dispatch('user/getUserDiscountInfo')
					await this.$store.dispatch('user/getUserDiscountTakeEffect')
				} catch (e) {
					console.log('----------- await this.$store.dispatch -----------')
				}

				await new Promise((resove, reject) => {
					get_scl_info(removeEmptyProperty({
						sclId: this.sclId,
						code: this.$store.state.user.actCouponCode
					})).then(async res => {
						console.log(res.data, '=======res.data')
						res.data.data = res.data.data || {}
						this.detail = res.data.data || {}
						this.closeAdditional = this.detail.closeAdditional == 'Y'
						this.detail.detailImg = this.detail.detailImg || this.detail.coverImg
						let {
							isSpecial = '',
								qstnCount,
								sclPageSize,
								testTimesNum = '',
								detailInfo = '',
								scloReportDetail = '',
								addSclWay
						} = res.data.data

						this.$u.api.addLog({
							sclId: this.sclId,
							sourseType: addSclWay == 1 ? 9 : 0
						})

						this.detail.details = this.detail.details.replace(/<[^>]*>/g, "");

						if (this.detail.extBuyUse == '1' && this.detail.newOriginalPrice > 0) {
							if (this.detail.discountNum == 10) {
								this.freeUse = true
							}
						}

						if (scloReportDetail) {
							try {
								const mainResultD = JSON.parse(scloReportDetail) || {}
								this.referenceList = mainResultD.reference || mainResultD
									.literatrue
							} catch (e) {
								//TODO handle the exception
								console.log('parse json has some error mainResultD.')
							}
						}

						this.currentPrice = this.detail.newOriginalPrice
						this.oldPrice = this.detail.newOriginalPrice
						this.sclType = isSpecial == 'Y' ? 1 : 0

						this.extraInfo = {
							testTimesNum: {
								num: testTimesNum,
								unit: '分钟'
							},
							sclPageSize: sclPageSize,
							qstnCount: qstnCount,
						}

						let fullTypeShareImg = ''
						let tmpObj = {}
						if (detailInfo) {
							console.log(detailInfo, '====detailInfo')
							tmpObj = JSON.parse(detailInfo)
							console.log(tmpObj, 'tmpObjer224')
							this.extraInfo.qstnCount = (addSclWay === '1' && tmpObj.qstnNum) ?
								tmpObj.qstnNum : qstnCount
							if (tmpObj.introType == 'full') {
								this.pageType = 'full'
								this.fullPageImg = tmpObj.fullImg
								fullTypeShareImg = tmpObj.fullShareImg
							}

							if (tmpObj.introType) {
								this.introType = tmpObj.introType
							}

							if (tmpObj.introBtnOpt) {
								this.fullPageIntroBtn.img = tmpObj.introBtnOpt.img
								this.fullPageIntroBtn.wrapperBottom = tmpObj.introBtnOpt
									.wrapperBottom
								this.fullPageIntroBtn.style = {
									width: tmpObj.introBtnOpt.width,
									height: tmpObj.introBtnOpt.height
								}
							}
							if (tmpObj.introBackBtnOpt) {
								this.backBtn.img = tmpObj.introBackBtnOpt.img
								this.backBtn.wrapperBottom = tmpObj.introBackBtnOpt.wrapperBottom
								this.backBtn.style = {
									width: tmpObj.introBackBtnOpt.width,
									height: tmpObj.introBackBtnOpt.height
								}
							}

							this.moreType = tmpObj.moreType || ''
							if (tmpObj.acquireDetails) {
								this.summaryInfo.testBenefits = tmpObj.acquireDetails[1]
							}
							if (tmpObj.fitDetails) {
								this.summaryInfo.targetAudience = tmpObj.fitDetails[1]
							}
							if (tmpObj.noticeDetails) {
								this.summaryInfo.evaluationInstructions = tmpObj.noticeDetails[1]
							}
							if (tmpObj.handPointImg) {
								this.staticImgs.handPointer = tmpObj.handPointImg
							}
							if (tmpObj.introBtn) {
								this.staticImgs.introBtnImg = tmpObj.introBtn
							}
							if (tmpObj.fullType) {
								this.fullType = tmpObj.fullType
							}
							if (tmpObj.showPrivacyTip) {
								this.showPrivacyTip = tmpObj.showPrivacyTip
							}
							if (tmpObj.introText) {
								this.fullSclIntro = tmpObj.introText
							}

							this.isAfterPay = tmpObj.payMode === 'after'
						}

						if (this.detail.discountType) {
							this.discountedPrice = this.detail.discountPrice
						}

						res.data.data = res.data.data || {}
						const {
							sclName,
							detailImg,
							coverImg,
							adType,
							discountCode
						} = res.data.data
						this.shareData.title = sclName
						this.shareData.path = '/pages/index/index?userType=sclShare&sclId=' + this
							.sclId +
							'&inviteId=' + this.clientUserUid + '&adType=' + (adType ? adType :
								'') + '&code=' + (discountCode ? discountCode : '');
						this.shareData.imageUrl = tmpObj.shareImg || fullTypeShareImg ||
							detailImg || coverImg

						this.isSclNotFreeAndNotOwned = this.detail.newOriginalPrice > 0 && this
							.detail.extBuyUse == '1'
						resove()
					}).catch((err) => {
						reject(err)
					}).finally(() => {
						uni.hideLoading()
					})
				})
			},
			async checkFreePurchaseEligibility() {
				const {
					data: dRes
				} = await getDisCountZeroScl({
					sclId: this.sclId
				})
				if (dRes.success && dRes.data) {
					this.freeUse = true
				}
			},
			// 开始测评
			startScl: debounce(async function(type) {
				if (this.$fangBaoClick()) return
				if (this.pageLoading) {
					return false
				}
				let orderType = type

				//如果没登录，并且是非全屏的特殊测评. 并且是非后支付的测评 才要求先注册
				if ((!this.isLogin && (!this.isFullPageScl || !this.isAfterPay))) {
					this.paramObj.userType = 'sclShare'
					uni.redirectTo({
						url: '/subcontractorA/authorization/authorization?paramObj=' +
							JSON.stringify(this.paramObj)
					})
					return false
				}

				this.paramObj.isFullPage = this.isFullPageScl
				if (this.isFromEquityPage || (this.isFullPageScl && this.fullType != 'x06') || this
					.isAfterPay) {
					this.goScl();
				} else {

					if (this.freeUse) {
						await this.checkFreePurchaseEligibility()
					}



					if (this.isSclNotFreeAndNotOwned && !this.freeUse) {
						console.log(orderType, '=======orderType')
						if (this.isUseYiyuanAndNotLb && orderType != 'skipYiyuanLbModal' && orderType != 13) {
							this.yiyuanLbModalVisible = true
							return false
						}

						if (orderType == 'skipYiyuanLbModal') {
							orderType = null
						}



						//console.log(tmpRes, '-----tmpRessclPayToken')

						const that = this;
						const submitForm = removeEmptyProperty({
							price: this.detail.newOriginalPrice,
							orderType: orderType || '7',
							sclId: this.sclId,
							discountUid: this.$store.state.user.actCouponId || this.discountId,
							isAdditional: 'N',
							adClickId: uni.getStorageSync('adClickId')
						})
						uni.showLoading()
						this.pageLoading = true
						this.yiyuanLbModalVisible = false

						const {
							data: tmpRes
						} = await this.$u.api.getWxPayToken({
							sclId: this.sclId
						})
						submitForm.sclPayToken = tmpRes.data
						orderPay(submitForm).then(res => {
							if (res.data.code == 200 && that.pageLoading) {
								uni.requestPayment({
									provider: 'wxpay',
									service: 5,
									orderInfo: res.data.data.wr,
									timeStamp: res.data.data.wr.timeStamp,
									nonceStr: res.data.data.wr.nonceStr,
									package: res.data.data.wr.packageValue,
									signType: res.data.data.wr.signType,
									paySign: res.data.data.wr.paySign,
									success: function(res) {
										if (orderType == 13) {
											that.updateYiyuanLbStatus()
										}
										that.$store.dispatch(
											'user/getUserDiscountTakeEffect')
										that.payCallBack();
										uni.hideLoading()
									},
									fail: function(err) {
										console.log(err, '测评支付2')
										that.$showToast('支付取消');
									}
								});
							} else {
								that.$showToast(res.data.message);
							}
						}).catch(() => {
							uni.hideLoading()
						}).finally(() => {
							this.pageLoading = false
						})

					} else {

						console.log('====this.payCallBack')
						this.payCallBack();
					}
				}


			}, 300),
			goScl() {
				if (this.introType === 'queen') {
					uni.navigateTo({
						url: '/subcontractorD/pages/sclDoQuestion/sclDoQuestion?paramObj=' + JSON.stringify(this
							.paramObj)
					})
				} else {
					uni.redirectTo({
						url: '/subcontractorD/pages/sclDoQuestion/sclDoQuestion?paramObj=' + JSON.stringify(this
							.paramObj)
					})
				}
			},
			payCallBack() {
				console.log(this.isSclNotFreeAndNotOwned, '------1')
				console.log(this.freeUse, '------2')
				//普通测评支付回调
				updateSclBuyNum({
					sclId: this.sclId
				})
				this.goScl()
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(sclIntroduce.css);

	.full-page-intro-btn-wrapper {
		position: fixed;
		padding-bottom: calc(constant(safe-area-inset-bottom));
		padding-bottom: calc(env(safe-area-inset-bottom));

		.full-page-intro-btn-inner {
			position: relative;
			display: flex;
			width: 750rpx;

			justify-content: center;

			.hand-img {
				width: 166rpx;
				height: 166rpx;
				position: absolute;
				right: 10%;
				top: 20%;


			}
		}

	}


	.price-block-wrapper {
		display: flex;
		flex-direction: column;
		// height: 50rpx;


		.row-1 {
			display: flex;
			align-items: center;
			column-gap: 14rpx;
			height: 50rpx;

			.now-price-box {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #333333;
				line-height: 26rpx;
				text-align: left;
				font-style: normal;
			}

			.price-wrapper {
				display: flex;
				align-items: center;


				.price-text {
					font-family: PingFangSC, PingFang SC;
					font-weight: 300;
					font-size: 26rpx;
					color: #666666;
					line-height: 45rpx;
					text-align: left;
					font-style: normal;

					margin-right: 4rpx;
				}

				.price-box {
					font-family: PingFangSC, PingFang SC;
					font-weight: 300;
					font-size: 26rpx;
					color: #666666;
					line-height: 24rpx;
					text-align: left;
					font-style: normal;
				}


			}
		}

		//  .row-1 end

		.row-2 {
			display: flex;
			align-items: center;
			column-gap: 20rpx;
			// margin-top: 14rpx;
			margin-top: 8rpx;

			.info-box {
				height: 40rpx;
				width: 120rpx;
				background-size: cover;

				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #FFFFFF;
				line-height: 37rpx;
				text-align: center;
				font-style: normal;
			}
		}

	}

	.sc-content {
		text-indent: 2em;
		margin-bottom: 58rpx;
		// font-weight: normal;
	}

	.scl-start-b {
		width: 562rpx;
		height: 108rpx;
	}


	.loop-pointer {
		animation-iteration-count: infinite;
		animation-name: loading;
		animation-duration: 1900ms;
		animation-delay: 0;
		animation-timing-function: ease;
	}

	@keyframes loading {
		0% {
			transform: scale(1);
		}

		50% {
			transform: scale(.78);
		}

		100% {
			transform: scale(1);
		}
	}




	.scl-start-btn-wrapper-pos {
		width: 622rpx;
		height: 100rpx;
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: 70rpx;
	}

	.scl-start-btn-wrapper {
		position: relative;
		width: 100%;
		height: 100%;

		.scl-start {
			width: 100%;
			height: 100%;
		}

		.yiyuan-intro-tip {
			position: absolute;
			top: -100rpx;
			left: 50%;
			transform: translateX(-50%);

			height: 100rpx;
			width: 396rpx;
		}

	}

	.down-and-up {
		animation-iteration-count: infinite;
		animation-name: shake;
		animation-duration: 1900ms;
		animation-delay: 0;
		animation-timing-function: ease;
	}

	@keyframes shake {
		0% {
			transform: translateX(-50%) translateY(0);
		}

		50% {
			transform: translateX(-50%) translateY(10%);
		}

		100% {
			transform: translateX(-50%) translateY(0);
		}
	}

	.yiyuan-discount {
		width: 90rpx;
		height: 42rpx;
		background: linear-gradient(270deg, #FF4F21 0%, #F74D20 81%, #FF9B5A 100%);
		border-radius: 8rpx 0rpx 14rpx 0rpx;

		line-height: 42rpx;

		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 40rpx;
		text-align: center;
		font-style: normal;
	}


	.scl-introduce-full-img-page {
		background-size: cover;

		.btn-wrapper {
			width: 100vw;
			height: 140rpx;
			// background-color: red;
			position: fixed;



			.btn-inner-wrapper {
				position: relative;
				width: 100%;
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;


				.main-img {
					width: 590rpx;
					height: 158rpx;
				}



				.img {
					position: absolute;
					width: 166rpx;
					height: 166rpx;

					bottom: -100rpx;
					right: 84rpx;
				}

			}


			.intro-text {
				margin-top: 24rpx;
				text-align: center;
				font-size: 20rpx;
				font-family: PingFang-SC, PingFang-SC;
				font-weight: 500;
				color: #FCE0DE;
				line-height: 28rpx;
			}


		}


		.privacy-tip-text {
			position: fixed;
			bottom: 4vh;

			text-align: center;
			padding: 80rpx 106rpx;
			left: 0;
			right: 0;
			font-size: 18rpx;

			font-family: PingFangSC, PingFang SC;
			font-weight: 400;

			color: #D07E46;
			line-height: 25rpx;
			text-align: center;
			font-style: normal;
		}

		.back-img-wrapper {
			position: fixed;
			z-index: 2;
			bottom: calc(20rpx + constant(safe-area-inset-bottom));
			bottom: calc(20rpx + env(safe-area-inset-bottom));

			left: 0;
			display: flex;
			align-items: center;
			// height: 58rpx;

			// .img {
			//   width: 38rpx;
			//   height: 38rpx;
			//   margin-right: 8rpx;
			// }
		}

		.back-wrapper {
			position: fixed;
			z-index: 2;
			bottom: calc(20rpx + constant(safe-area-inset-bottom));
			bottom: calc(20rpx + env(safe-area-inset-bottom));


			left: 30rpx;
			display: flex;
			align-items: center;
			height: 58rpx;

			.img {
				width: 38rpx;
				height: 38rpx;
				margin-right: 8rpx;
			}

			.text {
				font-size: 26rpx;
				font-family: PingFang-SC, PingFang-SC;
				font-weight: 500;
				color: rgba(255, 255, 255, 0.84);
				line-height: 37rpx;
				letter-spacing: 1px;
			}
		}
	}

	.line-through {
		margin-left: 8rpx;
		text-decoration: line-through;
	}

	.scl-introduce-page {
		padding-bottom: 200rpx;
		background-size: cover;
		$main-color-a: #58B938;
		$main-color-b: #747DE6;


		.style-a-page {
			.tit {
				margin-bottom: 40rpx;
				background: $main-color-a;

				&::after {
					border: 1rpx solid $main-color-a;
				}

				&::before {
					border: 1rpx solid $main-color-a;
				}
			}

		}

		.sib-price {
			display: flex;
			justify-content: space-between;
		}



		.scl-depression-checkup-group-entrance {
			width: 690rpx;
			height: 80rpx;
			background: linear-gradient(90deg, #DDEAFF 0%, #B2D2FE 100%);
			border-radius: 12rpx;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			padding-left: 12rpx;
			position: relative;

			margin: auto;
			margin-top: 68rpx;
			margin-bottom: -24rpx;

			.price {
				font-family: PingFangSC, PingFang SC;
				font-weight: 600;
				font-size: 38rpx;
				color: #0F3B82;
				text-align: left;
				font-style: normal;
			}

			.txt {
				font-family: PingFangSC, PingFang SC;
				font-weight: 600;
				font-size: 28rpx;
				color: #0F3B82;
				text-align: left;
				font-style: normal;
				margin-left: 8rpx;
			}

			.img-abs {
				width: 160rpx;
				height: 126rpx;
				position: absolute;
				right: 0;
				bottom: 0;

				>.img {
					width: 100%;
					height: 100%;
				}
			}
		}


		.scl-checkup-group-entrance {
			width: 692rpx;
			// height: 63rpx;
			background: #FFEEEB;
			border-radius: 32rpx;
			margin: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			box-sizing: border-box;
			padding: 0 20rpx;
			padding-top: 4rpx;


			margin-top: 26rpx;

			.scl-checkup-group-entrance-box {
				// height: fit-content;
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				// margin-top: 26rpx;

				.left-box {
					display: flex;
					align-items: center;

					.price-box {
						display: flex;
						align-items: center;
					}

					.unit-icon {
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 24rpx;
						color: #F14C4C;
						// line-height: 26rpx;
						text-align: left;
						font-style: normal;
					}

					.num {
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 48rpx;
						color: #F14C4C;
						// line-height: 26rpx;
						text-align: left;
						font-style: normal;

						margin-bottom: 10rpx;
					}

					.text {
						margin-left: 12rpx;
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 26rpx;
						color: #333333;
						line-height: 37rpx;
						text-align: left;
						font-style: normal;
					}
				}

				.right-box {
					font-family: PingFangSC, PingFang SC;
					font-weight: 500;
					font-size: 26rpx;
					color: #333333;
					line-height: 37rpx;
					text-align: left;
					font-style: normal;
					display: flex;
					align-items: center;

					.img {
						width: 42rpx;
						height: 42rpx;
					}
				}

			}

		}

		.si-price {
			display: flex;
			align-items: flex-end;

			.original-price-text {
				color: #999999;
				font-size: 20rpx;
			}

			.line-through {
				margin-left: 8rpx;
				text-decoration: line-through;
			}

			.current-price-icon {
				line-height: 30rpx;
			}

			.current-price-text {
				font-size: 36rpx;
				line-height: 40rpx;
			}

		}

		.sid-price-discount {
			width: 80rpx;
			height: 40rpx;
			background: linear-gradient(270deg, #FF2F00 0%, #FC9C94 100%);
			box-shadow: 0rpx 2rpx 20rpx 0rpx #D4F1C4;

			// border: 2rpx solid;
			border-image: linear-gradient(180deg, rgba(252, 244, 230, 1), rgba(255, 254, 235, 1)) 2 2;
			border-radius: 8rpx 0rpx 14rpx 0rpx;
			text-align: center;
			line-height: 40rpx;

			font-size: 28rpx;
			font-family: PingFang-SC-Heavy, PingFang-SC;
			font-weight: 800;
			color: #FFFFFF;
			line-height: 40rpx;
			text-shadow: 0px 2px 20px #D4F1C4;

		}

		.text {
			font-size: 20rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #F14C4C;
			line-height: 28rpx;
			margin-left: 10rpx;
			text-align: justify;
		}

		.si-title {
			display: flex;
			align-items: center;
			word-break: break-all;
			word-wrap: break-word;
		}

		.tag {
			margin-left: 16rpx;
			border-radius: 8rpx;
			border: 1rpx solid #48AEF7;
			word-break: keep-all;


			height: 40rpx;
			width: fit-content;
			padding: 0 20rpx;
			line-height: 40rpx;

			font-size: 25rpx;
			font-family: PingFang-SC, PingFang-SC;
			font-weight: bold;
			color: #48AEF7;
		}

		.si-tips {
			font-weight: normal;
		}

		.test-num {
			width: 26rpx;
			height: 26rpx;
		}

		.view-num {
			font-size: 22rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 300;
			// color: #888888;
			color: #999999;
			// padding-top: 20rpx;

			display: flex;
			align-items: center;
			height: 50rpx;

		}

		.nums-info-wrapper {
			box-sizing: border-box;

			view {
				box-sizing: border-box;
				word-break: break-all;
			}

			text {
				word-break: break-all;
			}

			display: flex;
			justify-content: space-around;
			margin-bottom: 46rpx;

			.num-box {
				position: relative;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				width: 228rpx;

				.row-1 {
					font-size: 26rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 500;
					color: #999999;

				}

				.row-2 {
					margin-top: 6rpx;
					display: flex;
					align-items: baseline;

					.num {
						font-size: 36rpx;
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						color: #666666;
					}

					.text {
						font-size: 26rpx;
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						color: #999999;
					}
				}

				&::after {
					position: absolute;
					content: '';
					right: 0;
					top: 4rpx;
					bottom: 4rpx;
					width: 1rpx;
					background-color: #DFDCDC;
					opacity: .8;
				}

				&:last-child::after {
					display: none;
				}
			}

			//.num-box - end
		}


		.summary-info-wrapper {
			padding: 0 30rpx;
			padding-top: 60rpx;

			box-sizing: border-box;

			view {
				box-sizing: border-box;
				word-break: break-all;
			}

			text {
				word-break: break-all;
			}

			.tit {
				height: 58rpx;
				// background: $main-color;//#747DE6;
				line-height: 58rpx;
				padding: 0 38rpx;
				position: relative;
				width: fit-content;
				margin: 18rpx auto;
				// margin-bottom: 40rpx;

				font-size: 34rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
				letter-spacing: 1px;


				&::after {
					content: '';
					position: absolute;
					left: 0;
					right: -30rpx;
					top: -16rpx;
					bottom: 0;
					// border: 1rpx solid $main-color;//#747DE6;
				}

				&::before {
					content: '';
					position: absolute;
					right: 0;
					left: -30rpx;
					bottom: -16rpx;
					top: 0;
					// border: 1rpx solid $main-color;//#747DE6;
				}
			}

			// .tit - end

			.test-benefits-block {

				.content-box {
					margin-top: 40rpx;
					margin-bottom: 30rpx;
					width: 100%;

					.sub-tit {
						font-size: 28rpx;
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						color: #333333;
					}

					.ul-box {
						margin-top: 8rpx;
						// margin-left: -8px;

						.li {
							font-size: 28rpx;
							font-family: PingFang-SC, PingFang-SC;
							// font-weight: 500;
							color: #333333;
							line-height: 48rpx;

							.index-text {
								text-align: center;
								width: 20rpx;
								display: inline-block;

							}
						}
					}
				}

			}

			//.test-benefits-block - end
			.target-audience-block {
				margin-top: 76rpx;

				.content-box {
					margin-top: 40rpx;
					background-size: contain;
					background-repeat: no-repeat;
					min-height: 636rpx;
					padding-top: 366rpx;

					.ul-box {
						margin: auto;
						width: 563rpx;
						padding: 14rpx 18rpx;

						background: #FFFFFF;
						box-shadow: 0rpx 2rpx 10rpx 0rpx #3E5CD3;
						border-radius: 14rpx;


						display: flex;
						flex-direction: column;
						row-gap: 12rpx;

						.index-text {
							box-sizing: border-box;
							width: 34rpx;
							display: inline-block;
							font-size: 32rpx;
							font-family: PingFangSC, PingFang SC;
							font-weight: 500;
							color: #456DCF;
							// margin-right: 40rpx;
						}

						.con-text {
							font-size: 28rpx;
							font-family: PingFangSC, PingFang SC;
							font-weight: 500;
							color: #333333;
						}
					}
				}

			}

			// .target-audience-block - end

			.instructions-block {
				margin-top: 60rpx;

				.content-box-wrapper {
					// margin-top: 33rpx;
					margin-top: 40rpx;

					padding: 36rpx 18rpx 28rpx 18rpx;
					// width: 645rpx;
					// height: 790rpx;
					background-color: #6FB3FC;
					border-radius: 20rpx;

					.content-box {
						border-radius: 20rpx;
						background-color: #fff;
						padding: 0 16rpx 40rpx 16rpx;
						// margin-top: 40rpx;
						display: flex;
						flex-direction: column;
						justify-content: center;

						.img {
							margin: auto;
							margin-top: 28rpx;
							width: 420rpx;
							margin-bottom: 30rpx;
							height: 48rpx;
						}

						.text {
							font-size: 28rpx;
							font-family: PingFang-SC, PingFang-SC;
							font-weight: 500;
							color: #333333;

							line-height: 38rpx;
							text-align: justify;

						}

						.text-indent {
							text-indent: 1.5em;
						}
					}
				}
			}

			//.instructions-block - end


			.tips-block {
				margin-top: 70rpx;
				display: flex;
				flex-direction: column;
				width: 100%;
				padding-bottom: 50rpx;

				.ul-box {
					display: flex;
					flex-direction: column;
					margin: auto;
					margin-top: 40rpx;
					width: 594rpx;

					.li {
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #333333;
						line-height: 48rpx;
						text-align: justify;

						font-style: normal;
					}
				}
			}

			.references-box {
				margin-top: 70rpx;
				display: flex;
				flex-direction: column;
				width: 100%;
				padding-bottom: 50rpx;


				// .tit{
				//   margin-left: 36rpx;
				//   width: fit-content;
				//   font-size: 40rpx;
				//   font-family: PingFangSC, PingFang SC;
				//   font-weight: 600;
				//   color: #195199;
				//   padding-bottom: 6rpx;
				//   border-bottom: 2rpx solid rgba(25, 81, 153, .3);
				// }

				.text-list {
					margin: auto;
					margin-top: 40rpx;
					// width: 675rpx;
					// width: 644rpx;
					// height: 1416rpx;
					border: 1rpx solid #C1C1C1;
					padding: 14rpx 18rpx;

					.text {
						text-indent: 2em;

						font-family: PingFang-SC, PingFang-SC;
						font-weight: 500;
						font-size: 24rpx;
						color: #666666;
						line-height: 46rpx;
						text-align: justify;
						font-style: normal;

					}
				}
			}

			// .references-box -end
		}

	}



	.black-animation {
		background: #000;
		width: fit-content;
		margin: auto;
		margin-bottom: 24rpx;
		border-radius: 50%;
		// position: fixed;
		// bottom: 20vh;
		// left: 0;
		// right: 0;
		display: flex;
		align-items: center;
		justify-content: center;

		.b,
		.b:before,
		.b:after {
			display: block;
			border-radius: 50%;
		}

		.b {
			// width: 50vmin;
			// height: 51vmin;
			// width: 110rpx;
			// height: 114rpx;

			width: 110rpx;
			height: 114rpx;
			box-shadow: 10rpx 0 30rpx 20rpx #f50,
				inset -1rpx 0 3rpx 4rpx #f80,
				-4rpx 0 50rpx 0 #f60;
			-webkit-animation: bh 5s linear infinite;
			animation: bh 5s linear infinite;

			// width: 110rpx;
			// height: 114rpx;
			// box-shadow: 1rpx 0 30rpx 20rpx #000000, inset -1vmin 0 30rpx 40rpx #2c2c2c, -4rpx 0 5rpx 0 #1a1a1a;
			// -webkit-animation: bh 5s linear infinite;
			// animation: bh 5s linear infinite;



		}

		@keyframes bh {
			0% {
				transform: rotate(0deg)
			}

			100% {
				transform: rotate(-360deg)
			}
		}

		.b:before,
		.b:after {
			content: "";
			background: white;
			position: relative;
			top: 6vmin;
		}

		.b:before {
			width: 30rpx;
			height: 30rpx;
			left: 40rpx;
			box-shadow: yellow 0 0 2vmin 2vmin,
				yellow 2vmin 4vmin 2vmin 0.5vmin;
		}

		.b:after {
			// width: 40rpx;
			// height: 40rpx;
			width: 80rpx;
			height: 80rpx;

			opacity: 0.03;
			left: -14rpx;
		}
	}
</style>